<div class="bg-light lter b-b wrapper-md">
    <h4 class="m-n font-thin">商品分析</h4>
</div>
<div class="wrapper" ng-controller="goodsAnalysisCtrl">
    <div class="panel panel-default padder-v padder-md">
        <div class="clearfix m-b-sm">
            <div class="inline pull-left m-r-sm" ng-controller="DatepickerDemoCtrl">
                <div class="input-group w-lg">
                    <input type="text" class="form-control" placeholder="请输入开始日期" uib-datepicker-popup="yyyy-MM-dd"
                           datepicker-popup="yyyy-MM-dd" ng-model="analysis.startTime"
                           alt-input-formats="altInputFormats" is-open="opened" datepicker-options="dateOptions"
                           close-text="关闭" clear-text="清空" current-text="今天" initialDate disabled/>
                    <span class="input-group-btn ">
                        <button type="button" class="btn btn-default " ng-click="open($event)"><i
                                class="glyphicon glyphicon-calendar"></i></button>
                    </span>
                </div>
            </div>
            <div class="inline pull-left m-r-sm" ng-controller="DatepickerDemoCtrl">
                <div class="input-group w-lg ">
                    <input type="text" class="form-control" placeholder="请输入结束日期" uib-datepicker-popup="yyyy-MM-dd"
                           datepicker-popup="yyyy-MM-dd" ng-model="analysis.endTime"
                           alt-input-formats="altInputFormats" is-open="opened" datepicker-options="dateOptions"
                           close-text="关闭" clear-text="清空" current-text="今天" min-date="analysis.startTime" initialDate
                           disabled/>
                    <span class="input-group-btn ">
                        <button type="button" class="btn btn-default " ng-click="open($event)"><i
                                class="glyphicon glyphicon-calendar"></i></button>
                    </span>
                </div>
            </div>
            <div class="inline pull-left">
                <select class="form-control" ng-model="analysis.shopId"
                        ng-options="item.id as item.name for item in shopList" required>
                    <option value="">所有店铺</option>
                </select>
            </div>
            <div class="col-sm-1">
                <button class="btn btn-md btn-default" ng-click="search()">查询</button>
            </div>
            <div class="col-sm-1 pull-right no-padder">
                <div class="text-right">
                    <button class="btn btn-success m-n" ng-click="exportData()">导出报表</button>
                </div>
            </div>
        </div>
        <div class="m-t-md m-b-md">
            <div class="panel-body panel-body b-b clearfix">
            <div class="inline padder-md padder-v pull-left b-r">
                <span class="h5 font-bold">商品分布</span>
            </div>
            <div class="pull-left col-md-11">
                <div class="inline col-md-3 padder">
                    <span class="block">
                        在架商品数
                        <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                           popover="当前时间，在架商品的数量。" popover-trigger="mouseenter"></i>
                    </span>
                        <label class="font-bold h3" ng-init="analysisData.putawayGoodsCount='--'">{{analysisData.putawayGoodsCount}}</label>
                    </div>
                    <div class="inline col-md-3 padder">
                    <span class="block">
                        下架商品数
                        <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                           popover="当前时间，下架商品的数量。" popover-trigger="mouseenter"></i>
                    </span>
                        <label class="font-bold h3" ng-init="analysisData.soldoutGoodsCount='--'">{{analysisData.soldoutGoodsCount}}</label>
                    </div>

                    <div class="inline col-md-3 padder">
                    <span class="block">
                        商品收藏量
                        <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                           popover="所有商品在统计时间内，被收藏的商品数量。" popover-trigger="mouseenter"></i>
                    </span>
                        <label class="font-bold h3" ng-init="analysisData.goodsCollections='--'">{{analysisData.goodsCollections}}</label>
                    </div>
                </div>
            </div>
            <div class="panel-body panel-body b-b clearfix">
            <div class="inline padder-md padder-v pull-left b-r">
                <span class="h5 font-bold">商品访问</span>
            </div>
            <div class="pull-left col-md-11">
                <div class="inline col-md-3 padder">
                    <span class="block">
                        商品曝光量
                        <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                           popover="所有商品在统计时间内，被曝光的次数，商品在统计时间内被曝光多次记为多次。" popover-trigger="mouseenter"></i>
                    </span>
                        <label class="font-bold h3" ng-init="analysisData.exposureNumber='--'">{{analysisData.exposureNumber}}</label>
                    </div>
                    <div class="inline col-md-3 padder">
                    <span class="block">
                        商品访客数(商品UV)
                        <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                           popover="所有商品在统计时间内，访问的用户人数，一个人在统计时间内访问多次记为一次。" popover-trigger="mouseenter"></i>
                    </span>
                        <label class="font-bold h3" ng-init="analysisData.visitUserCount='--'">{{analysisData.visitUserCount}}</label>
                    </div>
                    <div class="inline col-md-3 padder">
                    <span class="block">
                        商品浏览量(商品PV)
                    <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                       popover="所有商品在统计时间内，浏览的次数，一个人在统计时间内浏览多次记为多次。" popover-trigger="mouseenter"></i>
                    </span>
                        <label class="font-bold h3" ng-init="analysisData.goodsViewNumber='--'">{{analysisData.goodsViewNumber}}</label>
                    </div>
                </div>
            </div>
            <div class="panel-body panel-body b-b clearfix">
                <div class="inline padder-md padder-v pull-left b-r">
                    <span class="h5 font-bold">商品销售</span>
                </div>
                <div class="pull-left col-md-11">
                    <div class="inline col-md-3 padder">
                        <span class="block">
                            被访问的商品数
                        <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                           popover="所有商品在统计时间内，被用户访问的商品数量。" popover-trigger="mouseenter"></i>
                        </span>
                        <label class="font-bold h3" ng-init="analysisData.visitedGoodsCount='--'">{{analysisData.visitedGoodsCount}}</label>
                    </div>
                    <div class="inline col-md-3 padder">
                        <span class="block">
                            商品加购量
                            <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                               popover="所有商品在统计时间内，用户加入购物车的商品数量。" popover-trigger="mouseenter"></i>
                        </span>
                        <label class="font-bold h3"
                               ng-init="analysisData.cartNumber='--'">{{analysisData.cartNumber}}</label>
                    </div>
                    <div class="inline col-md-3 padder">
                        <span class="block">
                            商品转化率
                            <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                               popover="统计时间内，购买商品人数与浏览商品的人数的比例。" popover-trigger="mouseenter"></i>
                        </span>
                        <label class="font-bold h3"
                               ng-init="analysisData.goodsRate='--'">{{analysisData.goodsRate}}%</label>
                    </div>
                </div>
            </div>
        </div>
        <div class="fa-border">
            <div class="panel-body m-n lter">
                <div class="col-sm-1 pull-right no-padder">
                    <div class="text-right">
                        <button class="btn btn-success m-n" ng-click="exportAllData()">导出数据</button>
                    </div>
                </div>
            </div>
            <div class="table-responsive">
                <table class="table table-striped m-n">
                    <thead>
                    <tr>
                        <th>
                            商品信息
                        </th>
                        <th>
                            曝光次数
                            <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                               popover="统计时间内，指定商品的曝光次数，一个人在统计时间内访问多次记为多次。" popover-trigger="mouseenter">
                            </i>
                        </th>
                        <th>
                            下单数据
                            <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                               popover="统计时间内，所有订单的统计数据(不限方式)。" popover-trigger="mouseenter">
                            </i>
                        </th>
                        <th>
                            支付数据
                            <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                               popover="统计时间内，所有已付款订单的统计数据(购买方式)。" popover-trigger="mouseenter">
                            </i>
                        </th>
                        <th>
                            访客数
                            <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                               popover="统计时间内，买家点击该商品详情页的次数，一个人在统计时间内访问多次记为一次。" popover-trigger="mouseenter">
                            </i>
                        </th>
                        <th>
                            浏览量
                            <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                               popover="统计时间内，买家点击该商品详情页的次数，一个人在统计时间内访问多次记为多次。" popover-trigger="mouseenter">
                            </i>
                        </th>
                        <th>
                            收藏量
                            <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                               popover="统计时间内，买家收藏该商品详情页数量。" popover-trigger="mouseenter">
                            </i>
                        </th>
                        <th>
                            加购件数
                            <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                               popover="统计时间内，买家将该商品放入购物车中的数量。" popover-trigger="mouseenter">
                            </i>
                        </th>
                        <th>
                            单品转化率
                            <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="right"
                               popover="统计时间内，购买该商品的人数与该商品的访客数的比例。" popover-trigger="mouseenter">
                            </i>
                        </th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr ng-repeat="g in list">
                        <td>
                            <div>
                                <div class="pull-left m-r">
                                    <img src="{{app.image.goods}}{{g.goodsImg}}" err-src="img/error.png"
                                         style="height: 70px;width: 70px;"/>
                                </div>
                                <div class="pull-left">
                                    <a href="" class="w-sm h6 l-h block m-b-xs">{{g.name}}</a>
                                    <label class="font-bold h5 block">{{g.price}}元</label>
                                </div>
                            </div>
                        </td>
                        <td>
                            {{g.goodsExposureNumber}}
                        </td>
                        <td>
                            下单人数：{{g.ordersUserCount}}<br>
                            下单件数：{{g.ordersGoodsNumber}}
                        </td>
                        <td>
                            支付人数：{{g.payUserCount}}<br>
                            支付件数：{{g.payGoodsNumber}}
                        </td>
                        <td>{{g.visitUserCount}}</td>
                        <td>{{g.goodsViewNumber}}</td>
                        <td>{{g.goodsCollections}}</td>
                        <td>{{g.cartGoodsNumber}}</td>
                        <td>{{g.singleRate}}%</td>
                    </tr>
                    </tbody>
                </table>
                <div ng-if="list.length<=0 && !app.loading" class="padder-v text-center">
                    <span class="h6">~未搜索到任何数据~</span>
                </div>
                <div>
                    <circle-loading ng-if="app.loading"></circle-loading>
                </div>
            </div>
            <footer class="panel-footer">
                <div class="row">
                    <div class="col-sm-4 hidden-xs">
                    </div>
                    <div class="col-sm-4 text-center">
                        <small class="text-muted inline m-t-sm m-b-sm">显示第 {{startRow}} 至 {{endRow}} 项结果，共
                            {{totalItems}} 项
                        </small>
                    </div>
                    <div class="col-sm-4 text-right text-center-xs">
                        <pagination boundary-links="true" total-items="totalItems" ng-model="currentPage"
                                    ng-change="pageChanged()" max-size="{{maxPageRow}}"
                                    class="pagination-sm m-t-none m-b"
                                    previous-text="上一页" next-text="下一页"
                                    first-text="首页" last-text="尾页"></pagination>
                    </div>
                </div>
            </footer>
        </div>
    </div>
</div>